<template>
    <div>
        <div class="nochance notoucher" v-if="chances.length == 0">
            <div class="alert">该客户还未产生销售机会。</div>
        </div>
        <el-table border ref="multipleTable" :data="chances"  tooltip-effect="dark" style="width: 100%" v-else>
            <el-table-column prop="oppoName" label="机会名称" header-align="center" align="center"  > </el-table-column>
            <el-table-column prop="customer.customerName" label="客户名称" header-align="center" align="center"></el-table-column>
            <el-table-column prop="worker.empName" label="业务员" width="150" header-align="center" align="center"> </el-table-column>
            <el-table-column prop="state.oppoStateName" label="机会状态" header-align="center" align="center"></el-table-column>
            <el-table-column prop="tel" label="报价金额" header-align="center" align="center"></el-table-column>
            <el-table-column  label="预计成交时间" header-align="center" align="center">
                <template slot-scope="s">
                    {{s.row.planIdealTime | format_date}}
                </template>
            </el-table-column>
        </el-table>

       <!-- 分页
        <div class="block" style="margin-top:10px">
            <el-pagination background layout="total, prev, pager, next" :total="1000"></el-pagination>
        </div>-->
    </div>
</template>

<script>
    export default {
        name: "SaleChance",
        data:function () {
            return{
                chances:[],//该用户所有销售机会
            }
        },
        methods:{
            getHisSaleOppo(customerId){
                this.axios.get("api/customer/his_saleoppo",{params:{'customerId':customerId}})
                    .then(v=>{
                    this.chances = v.data
                        window.console.log(this.chances)
                }).catch()
            }
        },
        created() {
            this.getHisSaleOppo(this.$store.state.vueCustomerView.customer.customerId);
        }
    }
</script>

<style scoped>
    .notoucher .alert{ border-radius: 3px; width: 100%;height: 100%;  color: #31708f;
        background-color: #d9edf7;
        border-color: #bce8f1;}
    .nochance .alert{
        border-radius: 3px; width: 97%;height: 100%; padding: 20px 10px 20px 20px;color: #a94442;
        background-color: #f2dede;
        line-height: 20px;
        border-color: #ebccd1;
    }
</style>